import Taro from '@tarojs/taro';
import { View, Image, Text } from '@tarojs/components';
import http from '@/utils/http';
import utils from '@/utils/util';
import './index.scss';

import RecordItem from '@/components/recordItem/index';
import Sunrvey from '@/components/survey/index';

let app = Taro.getApp();
class SifninDetails extends Taro.Component {
    constructor(props) {
        super(props);
        this.state = {
            signinDetails: {}
        }
    }
    componentWillMount() {
        this.getCheckDetail();
    }
    config = {
        navigationBarTitleText: '签到详情'
    }
    getCheckDetail() {
        http.get('getCheckDetail', {
            id: this.$router.params.id
        }).then((res) => {
            let { file, checktime } = res.datas;
            res.datas.file = file ? file.split('|') : [];
            checktime = checktime.replace(/-/g, "/");
            const date = checktime && new Date(checktime) || new Date();
            const month = date.getMonth() + 1;
            const day = date.getDate();
            const hour = date.getHours();
            const minute = date.getMinutes();
            res.datas.time = utils.addZero(hour) + ':' + utils.addZero(minute)
            res.datas.months = utils.addZero(month) + '月' + utils.addZero(day) + '日'
            this.setState({
                signinDetails: res.datas
            })
        }).catch((err) => {
        })
    }
    previewImage(picturesArr, item) {
        app.previewImage(picturesArr, item);
    }
    render() {
        const { signinDetails } = this.state;
        let rdata = JSON.parse(JSON.stringify(signinDetails));
        delete rdata['drugs'];
        return (
            <View className='signin-details'>
                <View className='flex flex-item-v-center bg_fff p-2-5 mb-2-5'>
                    <View className='user-info'>
                        <Image className='portrait' mode='widthFix' src={process.env.IMG_URL + signinDetails.pic}></Image>
                    </View>
                    <View className='pl-3 flex-1'>
                        <View className='flex flex-r flex-item-between'>
                            <Text className='ft32 ft_w600'>{signinDetails.xjr}</Text>
                        </View>
                        <View className='tag mt-2 fc_FFF ft24'>{signinDetails.department}</View>
                    </View>
                </View>
                <View className='pl-2-5 pr-2-5 mt-2-5'>
                    <RecordItem signRecord={signinDetails}  ></RecordItem>
                    <Sunrvey
                        isTop={false}
                        isSignin='true'
                        medicalkit={rdata}
                        entranceType={3}
                        fcColor='fc_B9C'
                        renderSolt={
                            <View className='fc_65C pb-6'>
                                <View className='mb-4 word-all'>
                                    备注：{signinDetails.mark}
                                </View>
                                <View className='mb-4'>附件:</View>
                                {signinDetails.file && <View className='record-picture  flex flex-r'>
                                    {
                                        signinDetails.file.map((item) => {
                                            return (
                                                <View key={item} className='imgs' onClick={() => { this.previewImage(signinDetails.file, item) }}>
                                                    <Image className='pictures-img' mode='center' src={item}></Image>
                                                </View>
                                            )
                                        })
                                    }
                                </View>
                                }
                            </View>
                        }
                    ></Sunrvey>
                </View>
            </View>
        );
    }
}

export default SifninDetails;
